<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>汉字点击游戏</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <style>
        .grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            grid-gap: 10px;
            margin: 50px auto;
            width: 400px;
            text-align: center;
        }
        .cell {
            background-color: #ea7474;
            padding: 50px 0;
            font-size: 36px;
            cursor: pointer;
            color: beige;
        }
        .cell:hover{
            background-color: #53c36d;
        }
    </style>
</head>
<body>

<div class="grid">
    <div class="cell" onclick="checkOrder(0)">蒙</div>
    <div class="cell" onclick="checkOrder(1)">学</div>
    <div class="cell" onclick="checkOrder(2)">寨</div>
    <div class="cell" onclick="checkOrder(3)">灵</div>
    <div class="cell" onclick="checkOrder(4)">启</div>
    <div class="cell" onclick="checkOrder(5)">敦</div>
    <div class="cell" onclick="checkOrder(6)">锦</div>
    <div class="cell" onclick="checkOrder(7)">钟</div>
    <div class="cell" onclick="checkOrder(8)">中</div>
    <div class="cell" onclick="checkOrder(9)">屏</div>
    <div class="cell" onclick="checkOrder(10)">高</div>
    <div class="cell" onclick="checkOrder(11)">坝</div>
</div>

<script>
    var userOrder = ""; // 用户点击的顺序    
    function checkOrder(index) {
        userOrder += index;
        console.log(userOrder);
        if(userOrder == "5281"){
            console.log("成功");
            window.localStorage.setItem("aaa","bbb");
            window.location.href = "/pages/store/upyun/index.html";
        }
    }
</script>

</body>
</html>